import React, { Component } from 'react';
import { List } from '$yo-component';
import Header from '$component/header/index.js';
import yoHistory from '$common/history';
import './index.scss';

import fetch from "isomorphic-fetch"

class Detail extends Component {
    constructor() {
        super();
        this.state = {
            dataSource: [1]
        };
    }
    componentWillMount(){
        console.log(this.state.dataSource)
        fetch("../mock/skill.json")
        .then(result => {
            return result.json()
        })
        .then(res =>{
            console.log(res);
            this.setState({
                dataSource:res
            })
        })
    }
   

    render() {
        return (
            <div className="yo-flex">
                <Header title="技能分享"/>
                <List
                    ref="list"
                    extraClass="flex m-list"
                    dataSource={this.state.dataSource}
                    renderItem={(item,i) => [
                        <img className="mark"src="../page/home/img/jw1.jpg" width="50px" height="50px"/>,
                        <div className="flex">
                            <h1 >{item.category}</h1>
                            <div >{item.name}</div>
                        </div>
                    ]}
                />
            </div>
        )
    }
}


export default Detail;
